<template>
	<div >
		<div class="t_util_box">
			<div class="t_util_left">
				<div>时间周期：</div>
				<el-date-picker
				:clearable="false"
				@change="changetime"
				v-model="timeloop"
				value-format="yyyy-MM-dd HH:mm:ss"
				type="datetimerange"
				range-separator="至"
				start-placeholder="开始日期"
				end-placeholder="结束日期">
				</el-date-picker>
				<div style="margin-left: 30px;">直播时段：</div>
				<div class="t_time_duan">
					<div :class="{'t_sd_btn_lei':sd==1}" @click="changesd(1)" class="t_sd_btn">正常时段</div>
					<div :class="{'t_sd_btn_lei':sd==2}" @click="changesd(2)"  class="t_sd_btn">非正常时段</div>
				</div>
			</div>
      <div class="kflex">
        <router-link to="/zhibotongji/zhuboguanli">
        	<el-button type="danger">主播管理</el-button>
        </router-link>
        <el-button type="primary" style="margin-left: 20px;" @click="zhubodizhi">外部主播订单查询链接></el-button>
      </div>



		</div>
		<el-table
			:header-cell-style="{
			background:'#F4F4F4',
			color:'#7D8087'}"
			:data="tableData"
			stripe
			style="width: 100%">
			<el-table-column
			prop="name"
			label="直播间&店铺">
			</el-table-column>
			<el-table-column
			prop="source"
			label="来源">
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd==''"
      sortable
			prop="total_time"
			label="总时长">
				<template slot-scope="scope">
					{{getTime(scope.row.total_time)[0]+'小时'+getTime(scope.row.total_time)[1]+'分钟'}}
					<!-- {{getTime('283914')[0]+'小时'+getTime(scope.row.total_time)[1]+'分钟'}} -->
				</template>
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd=='1'"
			prop="total_normal_time"
			label="正常时段总时长">
				<template slot-scope="scope">
					{{getTime(scope.row.total_normal_time)[0]+'小时'+getTime(scope.row.total_normal_time)[1]+'分钟'}}
				</template>
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd=='2'"
			prop="total_not_normal_time"
			label="非正常时段总时长">
				<template slot-scope="scope">
					{{getTime(scope.row.total_not_normal_time)[0]+'小时'+getTime(scope.row.total_not_normal_time)[1]+'分钟'}}
				</template>
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd==''"
			prop="total_sales"
			sortable
			label="总销量">
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd=='1'"
			prop="total_normal_time_sales"
			sortable
			label="正常时段总销量">
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd=='2'"
			prop="total_not_normal_time_sales"
			sortable
			label="非正常时段总销量">
			</el-table-column>
			<el-table-column
			sortable
			v-if="sd==''"
			prop="zonglv"
			label="下单/小时">
			</el-table-column>
			<el-table-column
			sortable
			v-if="sd=='1'"
			prop="zhenglv"
			label="下单/小时">
			</el-table-column>
			<el-table-column
			sortable
			v-if="sd=='2'"
			prop="feilv"
			label="下单/小时">
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd==''"
			prop="total_delivery_num"
			label="总发货数">
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd=='1'"
			prop="total_normal_delivery_num"
			label="正常时段发货数">
			</el-table-column>
			<el-table-column
			:key="Math.random()"
			v-if="sd=='2'"
			prop="total_not_normal_delivery_num"
			label="非正常时段发货数">
			</el-table-column>
			<el-table-column v-if="isshowedit&&(shop_id == 304676 || shop_id == 50481)" label="操作">
				<template slot-scope="scope">
					<el-button
					size="mini"
					type="text"
					@click="toeditdaka( scope.row.source,scope.row.name,scope.row.type)">编辑打卡</el-button>
					<!-- <el-button
					size="mini"
					type="text"
					@click="downloadTask( scope.row.streamer_id)">下载明细</el-button> -->
				</template>
			</el-table-column>
		</el-table>

	</div>
</template>

<script>
	import axios from 'axios'



	export default {
		components: {

		},
		name: 'productionBasismanagDj',
		data() {
			return{
				tableData: [],
				timeloop:[],
                sd:'',
				url: '',
				activeName:'first',
				testarr:'',
				user:"",
				user_func:'',
				isshowedit:false,
				shop_id:"",
			}
		},
		created() {
			//权限
			this.shop_id = JSON.parse(localStorage.getItem("SHOP")).shop_id

			this.url = window.location.origin
			const end = new Date();
            const start = new Date();
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
			this.timeloop[0]=this.getCurrentTime(start)
			this.timeloop[1]=this.getCurrentTime(end)
			// console.log(this.timeloop)

			//获取所有标题
			this.getalltitle()
			 //权限问题
			 var user = JSON.parse(localStorage.getItem('USER'));
				this.user = user
				this.user_func = user.functions
				for (var i in this.user_func) {
					var func_number = this.user_func[i].code
					if (func_number.indexOf("Q010201") >= 0) {
						this.isshowedit = true
					}
				}
		},

		methods: {
      zhubodizhi:function(){
        axios.get('/api/live-stream/order/datas/url').then((response)=>{
        	const that = this;
        	this.$copyText(response.data.data.url).then(
        	  res => {
        	    that.$message.success("复制成功");
        	  },
        	  err => {
        	    that.$message.error("复制失败");
        	  }
        	);

        })
      },
			//中国标准时间转化
			getCurrentTime (date) {
				// let date = new Date()
				var year = date.getFullYear() //返回指定日期的年份
				var month = this.repair(date.getMonth() + 1);//月
				var day = this.repair(date.getDate());//日
				var hour = this.repair(date.getHours());//时
				var minute = this.repair(date.getMinutes());//分
				var second = this.repair(date.getSeconds());//秒

				//当前时间
				var curTime = year + "-" + month + "-" + day
						+ " " + hour + ":" + minute + ":" + second;
				return curTime;
			},
			//补0
			repair(i){
				if (i >= 0 && i <= 9) {
					return "0" + i;
				} else {
					return i;
				}
			},
			//获取所有标题
			async getalltitle (){
				await axios.get('/api/live-stream/all-title').then((response)=>{
					this.tableData=[]
					console.log('获取所有标题')
					console.log(response.data.data)
					this.testarr = response.data.data

				})

				for  (   let  i in this.testarr ) {
					setTimeout( ()=>{
						// console.log(i)
						this.getlist(this.testarr[i].title,this.testarr[i].source,this.testarr[i].type,this.testarr[i].live_room_id)
					}
         			, i * 1000)
					// 	//获取列表
					// 	// await this.getlist(this.testarr[i].title,this.testarr[i].source,this.testarr[i].type)
				}
			}, 
			//获取列表 
			 getlist(title,source,type,live_room_id){ 
				// console.log(1)
				
				
				 axios.get('/api/lives/statistics',{
					params:{
						start_time:this.timeloop[0],
						end_time:this.timeloop[1],
						tab:2,
						title:title,
						source:source,
						live_room_id:live_room_id
					}
				}).then((response)=>{

					// console.log(response.data.data)

					// 循环添加字段
					// for(var x=0;x<this.tableData.length;x++){
						// 总效率
						if(this.getTime(response.data.data.total_time)[0]=='0'){
							response.data.data['zonglv']=response.data.data.total_sales
						}else{
							response.data.data['zonglv']=Math.floor(response.data.data.total_sales/this.getTime(response.data.data.total_time)[0])
						}

						// 正常效率
						if(this.getTime(response.data.data.total_normal_time)[0]=='0'){
							response.data.data['zhenglv']=response.data.data.total_normal_time_sales
						}else{
							response.data.data['zhenglv']=Math.floor(response.data.data.total_normal_time_sales/this.getTime(response.data.data.total_normal_time)[0])
						}

						// 非正常效率
						if(this.getTime(response.data.data.total_not_normal_time)[0]=='0'){
							response.data.data['feilv']=response.data.data.total_not_normal_time_sales
						}else{
							response.data.data['feilv']=Math.floor(response.data.data.total_not_normal_time_sales/this.getTime(response.data.data.total_not_normal_time)[0])
						}
						// console.log(response.data.data.source)
						// response.data.data.source = JSON.parse(response.data.data.source)
						response.data.data['type'] = type
						this.tableData.push(response.data.data)
						// console.log(this.tableData[0])
						
					// }

				})
			},
			//选择时段
            changesd(val){
                if(val==this.sd){
                    this.sd=''
                }else{
                    this.sd=val
                }

            },
			//选择时间
			changetime(val){
				console.log(val)
				if(val==null){
					const end = new Date();
					const start = new Date();
					start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
					this.timeloop=[]
					console.log(this.timeloop)
					this.timeloop[0]=this.getCurrentTime(start)
					this.timeloop[1]=this.getCurrentTime(end)
				}
				//获取所有标题
				this.getalltitle()
			},
			//秒转时分秒
			getTime(value) {
				// var value='289015'
				let theTime = parseInt(value);// 秒
				let theTime1 = 0;// 分
				let theTime2 = 0;// 小时

				if(theTime > 59) {
				theTime1 = parseInt(theTime/60);
				theTime = parseInt(theTime%60);

				if(theTime1 > 59) {
				theTime2 = parseInt(theTime1/60);
				theTime1 = parseInt(theTime1%60);
				}
				}
				// let result = ''+parseInt(theTime)+'秒';
				let result = [0,0,parseInt(theTime)];
				if(theTime1 > 0) {
				// result = ''+parseInt(theTime1)+'分'+result;
				result = [0,parseInt(theTime1),parseInt(theTime)];
				}
				if(theTime2 > 0) {
				// result = ''+parseInt(theTime2)+'小时'+result;
				result = [parseInt(theTime2),parseInt(theTime1),parseInt(theTime)];
				}
				// console.log(result)
				// 	return [h, m, s]
				return result;
			},
			choosetab(val){
				console.log(val)
			},
			//下载
			downloadTask(streamer_id){
				var streamer_id = streamer_id
				if(this.sd==''){
					var type = 0
				}else if(this.sd=='1'){
					var type = 1
				}else if(this.sd=='2'){
					var type = 2
				}

				var start_time = this.timeloop[0]
				var end_time = this.timeloop[1]

				// console.log(this.url+'/api/live-stream/order/export?streamer_id='+streamer_id+'&type='+type+'&start_time='+start_time+'&end_time='+end_time)

				// var a = document.createElement("a");
				// a.setAttribute("href", this.url+'/api/live-stream/order/export?streamer_id='+streamer_id+'&type='+type+'&start_time='+start_time+'&end_time='+end_time);
				// a.click();

				axios.get('/api/live-stream/order/export', {
					params:{
						streamer_id:streamer_id,
						type:type,
						start_time:start_time,
						end_time:end_time,
					}
				}).then(response => {
					if (response.data.msg.code == 0) {
						let routeData = this.$router.resolve({
							path: '/order_export4',query:{
								type:'zhibo'
							}
						});
						window.open(routeData.href, '_blank');
					} else {
						this.$message.error(response.data.msg.info);

					}

				})
			},
			//进入编辑打开页面
			toeditdaka(source,name,type){
				this.$router.push({
					path: '/zhibotongji/editdaka',query:{
						source:source,
						name:name,
						type:type
					}
				});
			}
			
		}
	}
</script>

<style scoped>

    .t_util_box{
        display: flex;
        justify-content: space-between;
        margin-bottom: 30px;
        color: #666666;
		margin-top: 30px;
    }
    .t_util_left{
        display: flex;
        align-items: center;
    }
    .t_time_duan{
        display: flex;
    }
    .t_sd_btn{
        border: 1px solid #CCCCCC;
        padding: 5px 10px;
        border-radius: 20px;
        font-size: 13px;
        margin-right: 15px;
        cursor:pointer;
    }
    .t_sd_btn_lei{
        background-color: #FF5050;
        color: white;
    }
</style>
<style lang="scss" scoped>
	.productionBasismanagSoldout {


		.see {
			color: #409EFF;
			margin: 20px 0;
			cursor: pointer;
		}

		.cpflex {
			display: flex;
			flex-wrap: wrap;

			.el-form-item {
				margin-bottom: 0px;
			}
		}

		.kucun {
			.el-input {
				width: 200px;
			}

			.list {
				display: flex;
				text-align: center;
				border-bottom: 1px #EAEAEA solid;

				.bor1 {
					border-right: 1px #EAEAEA solid;

					i {
						color: #409EFF;
						font-size: 14px;
						margin-left: 10px;
						cursor: pointer;
					}
				}

				.th {
					background: #F9F9F9;
					line-height: 45px;
					flex: 1;
					font-size: 14px;
					box-sizing: border-box;
				}

				.td {
					line-height: 45px;
					font-size: 14px;
					flex: 1;
					box-sizing: border-box;
					color: #666;
				}

				.td2 {
					flex: 1.5
				}
			}
		}



				.o_ul {
					background: #F9F9F9;
					display: flex;

					.o_li {
						flex-basis: 160px;
						line-height: 45px;
						display: block;
						color: #727272;
						border-top: 3px #F9F9F9 solid;
						font-size: 14px;
						text-align: center;
					}

					.act {
						border-top: 3px #DD2727 solid;
						background: #FFFFFF;
					}
				}

				.title {
					border-bottom: 1px #EAEAEA solid;
					line-height: 45px;
					padding-left: 30px;
					font-size: 16px;
					background: #F9F9F9;
					color: #727272
				}

				.bsm {
					padding: 20px 20px 0 20px;

					.el-input {
						width: 220px;
					}
				}

				.row2 {
					color: #FFF;
					margin-top: 20px;

					a {
						color: #FFF;
					}
				}

				.con {
					margin: 20px;
					border: 1px #EAEAEA solid;

					.list {
						display: flex;
						text-align: center;
						border-bottom: 1px #EAEAEA solid;

						.bor1 {
							border-right: 1px #EAEAEA solid;

							i {
								color: #409EFF;
								font-size: 14px;
								margin-left: 10px;
								cursor: pointer;
							}
						}

						.th {
							background: #F9F9F9;
							line-height: 45px;
							flex: 1;
							font-size: 14px;
							box-sizing: border-box;
						}

						.td {
							line-height: 45px;
							font-size: 14px;
							flex: 1;
							box-sizing: border-box;
							color: #666;
						}

						.td2 {
							flex: 1.5
						}
					}
				}

				.el-pagination {
					text-align: right;
					margin-right: 20px;
					padding-bottom: 50px;
				}


	}
</style>
